<template>
  <div class="page flex-col" style="zoom:90%;">
    <div class="section_3">
      <div class="text-wrapper_2">
        <span class="text_10">运营</span> <span class="text_11">&gt;</span>
        <span class="text_12">情绪体验地图</span>
        <span class="text_13">&gt;</span>
        <span class="text_14">个人标签管理</span>
      </div>
    </div>
	
	<div class="section_4 flex-col">
	  <div class="box_8 flex-row justify-between">
	    <div class="text-wrapper_3 flex-col">
	      <span class="text_15">请输入您要查询的手机号码</span>
	    </div>
	    <button class="text-wrapper_4 flex-col" @click="onClick_1">
	      <span class="text_16">搜索</span>
	    </button>
	  </div>
	  <div class="box_9 flex-row">
	    <div class="box_10 flex-col justify-between">
	      <div class="section_5 flex-col"></div>
	      <div class="section_6 flex-col"></div>
	    </div>
	    <div class="box_11 flex-col">
	      <div class="text-wrapper_5 flex-row">
	        <span class="text_17">张xx</span>
	        <span class="text_18">13399990000</span>
	        <span class="text_19">昆明</span>
	      </div>
	      <div class="box_12 flex-row justify-between">
	        <span class="text_20">网龄：3年</span>
	        <div class="text-wrapper_6">
	          <span class="text_21">套餐：全球通</span>
	          <span class="text_22">88</span> <span class="text_23">元</span>
	        </div>
	      </div>
	      <div class="box_13 flex-row justify-between">
	        <div class="group_1 flex-col"></div>
	        <div class="text-wrapper_7 flex-col">
	          <span class="text_24">5G</span>
	        </div>
	        <div class="group_2 flex-col"></div>
	      </div>
	    </div>
	    <div class="box_14 flex-col"></div>
	    <div class="box_15 flex-col"></div>
	    <div class="box_16 flex-col">
	      <span class="text_25">满意度：</span>
	      <div class="text-wrapper_8 flex-col">
	        <span class="text_26">低满</span>
	      </div>
	      <div class="text-wrapper_9 flex-col">
	        <span class="text_27">高风险</span>
	      </div>
	    </div>
	    <div class="box_17 flex-col">
	      <div class="text-wrapper_10 flex-row justify-between">
	        <span class="text_28">79</span> <span class="text_29">分</span>
	      </div>
	      <div class="text-wrapper_11 flex-col">
	        <span class="text_30">满意度</span>
	      </div>
	      <div class="group_3 flex-row justify-between">
	        <div class="text-wrapper_12 flex-col">
	          <span class="text_31">中风险</span>
	        </div>
	        <div class="text-wrapper_13 flex-col">
	          <span class="text_32">低风险</span>
	        </div>
	      </div>
	    </div>
	    <div class="box_18 flex-col"></div>
	    <div class="box_19 flex-col"></div>
	    <div class="box_20 flex-col">
	      <span class="text_33">标签量：</span>
	      <div class="text-wrapper_14 flex-col">
	        <span class="text_34">资费不满</span>
	      </div>
	      <div class="text-wrapper_15 flex-col">
	        <span class="text_35">服务不满</span>
	      </div>
	    </div>
	    <div class="box_21 flex-col">
	      <div class="text-wrapper_16 flex-row justify-between">
	        <span class="text_36">78</span> <span class="text_37">个</span>
	      </div>
	      <div class="text-wrapper_17 flex-col">
	        <span class="text_38">网络不满</span>
	      </div>
	      <div class="text-wrapper_18 flex-col">
	        <span class="text_39">服务不满</span>
	      </div>
	    </div>
	    <div class="box_22 flex-col justify-between">
	      <div class="text-wrapper_19 flex-row justify-between">
	        <span class="text_40">不满：</span>
	        <span class="text_41">12</span>
	      </div>
	      <div class="text-wrapper_20 flex-col">
	        <span class="text_42">产品不满</span>
	      </div>
	    </div>
	    <span class="text_43">个</span>
	  </div>
	  <div class="text-wrapper_21 flex-col">
	    <span class="text_44">潜在不满</span>
	  </div>
	  <div class="box_23 flex-col"></div>
	  <span class="text_45">五星</span> <span class="text_46">集团</span>
	  <span class="text_47">家庭</span>
	</div>
	
	<div class="section_7 flex-row justify-between">
	  <div class="group_4 flex-col">
	    <div class="group_5 flex-col">
	      <div class="block_2 flex-col">
	        <div class="text-wrapper_22 flex-col justify-between">
	          <span class="text_48 txt">基础标签</span>
	          <span class="text_49"
	            >总量：17个&nbsp;&nbsp;&nbsp;&nbsp;不满：0个</span
	          >
	        </div>
	      </div>
	      <div class="block_3 flex-col">
	        <div class="text-wrapper_23 flex-col justify-between">
	          <span class="text_50 txt">调研标签</span>
	          <span class="text_51"
	            >总量：17个&nbsp;&nbsp;&nbsp;&nbsp;不满：0个</span
	          >
	        </div>
	      </div>
	      <div class="block_4 flex-col">
	        <div class="text-wrapper_24 flex-col justify-between">
	          <span class="text_52 txt">投诉标签</span>
	          <span class="text_53"
	            >总量：17个&nbsp;&nbsp;&nbsp;&nbsp;不满：0个</span
	          >
	        </div>
	      </div>
	      <div class="block_5 flex-col">
	        <div class="text-wrapper_25 flex-col justify-between">
	          <span class="text_54 txt">业务标签</span>
	          <span class="text_55"
	            >总量：17个&nbsp;&nbsp;&nbsp;&nbsp;不满：0个</span
	          >
	        </div>
	      </div>
	      <div class="block_6 flex-col">
	        <div class="text-wrapper_26 flex-col justify-between">
	          <span class="text_56 txt">质量标签</span>
	          <span class="text_57"
	            >总量：17个&nbsp;&nbsp;&nbsp;&nbsp;不满：0个</span
	          >
	        </div>
	      </div>
	    </div>
	  </div>
	  <div class="group_6">
	    <div class="box_24 flex-row">
	      <div class="block_7 flex-col"></div>
	      <span class="text_58 txt">正向标签视图</span>
	      <div class="block_8 flex-col"></div>
	      <span class="text_59 txt">不满标签视图</span>
	      <div class="block_9 flex-col"></div>
	      <span class="text_60 txt">标签与指标关联</span>
	    </div>
	    <div class="box_25 flex-row">
	      <div class="text-wrapper_27 flex-col">
	        <span class="text_61">1</span>
	      </div>
	      <div class="text-wrapper_28 flex-col">
	        <span class="text_62">正向标签</span>
	      </div>
	      <div class="text-wrapper_29 flex-col">
	        <span class="text_63">1</span>
	      </div>
	      <div class="text-wrapper_30 flex-col">
	        <span class="text_64">不满标签</span>
	      </div>
	      <span class="text_65">满意度指标</span>
	      <span class="text_66">不满标签</span>
	    </div>
	    <div class="box_26 flex-row">
	      <div class="group_7 flex-col">
	        <div class="text-wrapper_31 flex-col">
	          <span class="text_67">2</span>
	        </div>
	        <div class="text-wrapper_32 flex-col">
	          <span class="text_68">3</span>
	        </div>
	        <div class="text-wrapper_33 flex-col">
	          <span class="text_69">4</span>
	        </div>
	        <div class="text-wrapper_34 flex-col">
	          <span class="text_70">5</span>
	        </div>
	      </div>
	      <div class="group_8 flex-col">
	        <div class="text-wrapper_35 flex-col">
	          <span class="text_71">正向标签</span>
	        </div>
	        <div class="text-wrapper_36 flex-col">
	          <span class="text_72">正向标签</span>
	        </div>
	        <div class="text-wrapper_37 flex-col">
	          <span class="text_73">正向标签</span>
	        </div>
	        <div class="text-wrapper_38 flex-col">
	          <span class="text_74">正向标签</span>
	        </div>
	      </div>
	      <div class="group_9 flex-col">
	        <div class="text-wrapper_39 flex-col">
	          <span class="text_75">2</span>
	        </div>
	        <div class="text-wrapper_40 flex-col">
	          <span class="text_76">3</span>
	        </div>
	        <div class="text-wrapper_41 flex-col">
	          <span class="text_77">4</span>
	        </div>
	        <div class="text-wrapper_42 flex-col">
	          <span class="text_78">5</span>
	        </div>
	      </div>
	      <div class="group_10 flex-col">
	        <div class="text-wrapper_43 flex-col">
	          <span class="text_79">不满标签</span>
	        </div>
	        <div class="text-wrapper_44 flex-col">
	          <span class="text_80">不满标签</span>
	        </div>
	        <div class="text-wrapper_45 flex-col">
	          <span class="text_81">不满标签</span>
	        </div>
	        <div class="text-wrapper_46 flex-col">
	          <span class="text_82">不满标签</span>
	        </div>
	      </div>
	      <div class="group_11 flex-col">
	        <div class="text-wrapper_47 flex-col">
	          <span class="text_83">1</span>
	        </div>
	        <div class="text-wrapper_48 flex-col">
	          <span class="text_84">2</span>
	        </div>
	        <div class="text-wrapper_49 flex-col">
	          <span class="text_85">3</span>
	        </div>
	        <div class="text-wrapper_50 flex-col">
	          <span class="text_86">4</span>
	        </div>
	      </div>
	      <div class="group_12 flex-col"></div>
	      <div class="group_13 flex-col">
	        <div class="text-wrapper_51 flex-col">
	          <span class="text_87">1</span>
	        </div>
	        <div class="text-wrapper_52 flex-col">
	          <span class="text_88">2</span>
	        </div>
	        <div class="text-wrapper_53 flex-col">
	          <span class="text_89">3</span>
	        </div>
	        <div class="text-wrapper_54 flex-col">
	          <span class="text_90">4</span>
	        </div>
	      </div>
	    </div>
	    <div class="box_27 flex-row">
	      <div class="grid_1 flex-row">
	        <div class="text-wrapper_55 flex-col">
	          <span class="text_91">6</span>
	        </div>
	        <div class="text-wrapper_56 flex-col">
	          <span class="text_92">正向标签</span>
	        </div>
	        <div class="text-wrapper_57 flex-col">
	          <span class="text_93">7</span>
	        </div>
	        <div class="text-wrapper_58 flex-col">
	          <span class="text_94">正向标签</span>
	        </div>
	      </div>
	      <div class="text-wrapper_59 flex-col">
	        <span class="text_95">5</span>
	      </div>
	      <div class="text-wrapper_60 flex-col">
	        <span class="text_96">5</span>
	      </div>
	    </div>
	  </div>
	</div>
	
	<div class="section_8 flex-col">
	  <div class="text-wrapper_61 flex-row">
	    <span class="text_97 txt">满意度指标</span>
	  </div>
	  <div class="block_10 flex-row">
	    <div class="box_28 flex-col"></div>
	    <span class="text_98">xxx满意度</span>
	    <div class="box_29 flex-col">
	      <div class="text-wrapper_62 flex-row justify-between">
	        <span class="text_99">TOP1</span>
	        <span class="text_100">不满标签</span>
	      </div>
	    </div>
	    <div class="box_30 flex-col">
	      <div class="text-wrapper_63 flex-row justify-between">
	        <span class="text_101">TOP2</span>
	        <span class="text_102">不满标签</span>
	      </div>
	    </div>
	    <div class="box_31 flex-col">
	      <div class="text-wrapper_64 flex-row justify-between">
	        <span class="text_103">TOP3</span>
	        <span class="text_104">不满标签</span>
	      </div>
	    </div>
	    <div class="box_32 flex-col">
	      <div class="text-wrapper_65 flex-row justify-between">
	        <span class="text_105">TOP4</span>
	        <span class="text_106">不满标签</span>
	      </div>
	    </div>
	    <div class="box_33 flex-col">
	      <div class="text-wrapper_66 flex-row justify-between">
	        <span class="text_107">TOP5</span>
	        <span class="text_108">不满标签</span>
	      </div>
	    </div>
	  </div>
	  <div class="block_11 flex-row justify-between">
	    <div class="text-wrapper_67">
	      <span class="text_109">关怀记录：&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_110">1</span>
	      <span class="text_111">&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_112">次</span>
	    </div>
	    <div class="text-wrapper_68">
	      <span class="text_109">关怀记录：&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_113">4</span>
	      <span class="text_111">&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_112">次</span>
	    </div>
	    <div class="text-wrapper_69">
	      <span class="text_109">关怀记录：&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_114">0</span>
	      <span class="text_111">&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_112">次</span>
	    </div>
	    <div class="text-wrapper_70">
	      <span class="text_109">关怀记录：&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_115">2</span>
	      <span class="text_111">&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_112">次</span>
	    </div>
	    <div class="text-wrapper_71">
	      <span class="text_109">关怀记录：&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_110">1</span>
	      <span class="text_111">&nbsp;&nbsp;&nbsp;</span>
	      <span class="text_112">次</span>
	    </div>
	  </div>
	</div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      constants: {},
    };
  },
  methods: {  
    onClick_1() {
      alert(1);
    },
  },
};
</script>
<style src="../../assets/style/labcom.css" />
<style src="../../assets/style/lab.css" />
